<template>
  <div class="page page-user-order has-headbar page-full">
    <head-bar title="我的预定" :prevRoute="{name: 'user-home'}" />
    <van-tabs @click="onTabClick" v-model="activeIndex">
      <van-tab title="场馆预定">
        <stadium-orders></stadium-orders>
      </van-tab>
      <van-tab title="精品培训">
        <train-orders></train-orders>
      </van-tab>
      <!-- <van-tab title="体质监测">
        <healthy-orders></healthy-orders>
      </van-tab> -->
    </van-tabs>
  </div>
</template>

<script>
import StadiumOrders from './components/StadiumOrders'
import TrainOrders from './components/TrainOrders'
// import HealthyOrders from './components/HealthyOrders'
import { Tabs, Tab } from 'vant'
import { wxjsdkMixin } from '@/components/mixins'
export default {
  mixins: [wxjsdkMixin],
  name: 'user-orders',
  components: {
    [Tabs.name]: Tabs,
    [Tab.name]: Tab,
    StadiumOrders,
    TrainOrders
    // HealthyOrders
  },
  data () {
    return {
      activeIndex: 0
    }
  },
  mounted () {
    this.wechatHideMenu()
    this.activeIndex = this.$route.query.type
  },
  methods: {
    onTabClick (index) {}
  }
}
</script>

<style lang="less" scoped>
/deep/ .van-tabs {
  height: 100%;
  box-sizing: border-box;
}
/deep/ .van-tab--active {
  color: @colorPrimary;
}
/deep/ .van-tabs__line {
  background-color: @colorPrimary;
}
/deep/ .van-tabs__content {
   height: 100%;
}
/deep/ .van-tab__pane {
  height: 100%;
  overflow: auto;
}
/deep/ .van-tabs__track{
  height: 100%;
}
</style>
